<template>
	<view>
		<uni-navbar :title="'选课列表'"></uni-navbar>
		<div class="shou" v-for="(item,index)  in list" :key="index">
			<div class="shou-one" @click="jifzx(index)">
				<ul>
					<li>
						<h3>{{item.name}}</h3>
						<span>{{item.tit}}</span>
					</li>
					<li>
						<span>课程顾问名：{{item.nametext}}</span>
					</li>
					<li>
						<span>课程价格：{{item.zhek}}</span>
						<span>{{item.text}}</span>
					</li>
				</ul>
			</div>
			<div class="shou-two">
				<view @click="qici">报期次</view>
				<view @click="qichax">查询期次</view>
			</div>
		</div>
		<tarbar></tarbar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						name: '2021全程面授班-助理',
						tit: '已交清',
						nametext: '王富贵',
						zhek: '折扣价6020元',
						text: '折扣价2624元',
						url: '/pages/user_indexs/index-jiaof/index-jiaof'
					},
					{
						name: '2021全程面授班-助理',
						tit: '已交清',
						nametext: '王富贵',
						zhek: '折扣价6020元',
						text: '折扣价2624元',
						url: '/pages/user_indexs/index-jiaof/index-jiaof'
					},
					{
						name: '2021全程面授班-助理',
						tit: '已交清',
						nametext: '王富贵',
						zhek: '折扣价6020元',
						text: '折扣价2624元',
						url: '/pages/user_indexs/index-jiaof/index-jiaof'
					}
				]
			};
		},
		methods: {
			qichax() {
				uni.navigateTo({
					url: '/pages/user_indexs/index-baci/index-baci'
				})
			},
			qici() {
				uni.navigateTo({
					url: '/pages/user_indexs/index-qici/index-qici'
				})
			},
			jifzx(index) {
				uni.navigateTo({
					url: this.list[index].url
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #eee;
	}

	.shou {
		margin-top: 10rpx;
		// width: 750rpx;
		// height: 275rpx;
		background-color: #fff;
		padding: 30rpx;

		.shou-one {
			ul {
				li:nth-child(1) {
					display: flex;
					justify-content: space-between;

					h3 {
						display: inline-block;
						font-size: 26rpx;
						font-weight: bold;
						color: #4D4D4D;
					}

					span {
						display: inline-block;
						width: 88rpx;
						height: 27rpx;
						background: #CAE8FF;
						font-size: 18rpx;
						font-weight: 400;
						color: #008EFE;
						line-height: 27rpx;
						text-align: center;
					}
				}

				li:nth-child(2) {
					margin-top: 35rpx;

					span {
						font-size: 20rpx;
						font-weight: 400;
						color: #4D4D4D;
					}
				}

				li:nth-child(3) {
					display: flex;
					justify-content: space-between;
					margin-top: 33rpx;
					margin-bottom: 33rpx;

					span:nth-child(1) {
						font-size: 20rpx;
						font-weight: 400;
						color: #4D4D4D;
					}

					span:nth-child(2) {
						font-size: 20rpx;
						font-weight: 400;
						color: #4D4D4D;
					}
				}
			}
		}

		.shou-two {
			border-top: 2rpx solid #E6E6E6;
			display: flex;

			view {
				margin-top: 20rpx;
				width: 140rpx;
				height: 44rpx;
				text-align: center;
				line-height: 44rpx;
				color: #fff;
				font-size: 24rpx;
			}

			view:nth-child(1) {
				background: #FE7726;
			}

			view:nth-child(2) {
				margin-left: 25rpx;
				background: #008EFE;
			}
		}
	}
</style>
